home *** CD-ROM | disk | FTP | other *** search
/ Nikkei Mac 20 / NIKKEI-MAC-CD-VOL-20-1998-12.ISO.7z / NIKKEI-MAC-CD-VOL-20-1998-12.ISO / オンラインソフト / 9.ウェブ作成ツール / PageSpinner / PageSpinner Docs Japan.sit / PageSpinner Docs Japan / Examples / JavaScript / Dynamic Document Stationery < prev    next >
Text File  |  1996-12-14  |  6KB  |  216 lines
  1. <HTML>
  2. <HEAD>
  3. <TITLE>ダイナミックドキュメント</TITLE>
  4.  
  5. <SCRIPT LANGUAGE="JavaScript">
  6. <!-- Beginning of JavaScript --------
  7. /*
  8.     Dynamic Document
  9.     Written by Jerry Aman, Optima System, Aug 2, 1996. 
  10.     Modified Aug 13, 1996
  11.  
  12.     September 24: Added a tweak that will make the time 
  13.     to be displayed correctly in Navigator 3.0.
  14.     The time seem to be offset by one hour, maybe this have
  15.     something to do with daylight savings?
  16.  
  17.     Part of the PageSpinner distribution.
  18.  
  19.     We will not be held responsible for any unwanted 
  20.     effects due to the usage of this script or any derivative.  
  21.     No warrantees for usability for any specific application are 
  22.     given or implied.
  23.  
  24.     You are free to use and modify this script,
  25.     if the credits above are given in the source code
  26. */
  27.  
  28. // getHourOfDay()
  29. // Returns: Integer containing the hour 0-24
  30.  
  31. function getHourOfDay()
  32. {       var now = new Date();
  33.         return(now.getHours());
  34. }
  35.  
  36.  
  37. // getTime()
  38. // Returns: Text containing the time in the format HH:MM
  39.  
  40. function getTime()
  41. {       
  42.     var now = new Date();
  43.     var minutes = now.getMinutes();
  44.     var divider = ":";
  45.  
  46.     if (minutes<10)
  47.         divider = ":0";
  48.  
  49.         // Hack to get it to display the time 
  50.         // correctly in version 3.0, (adjust for offset)
  51.     if (navigator.appVersion.lastIndexOf('3.') != -1 )
  52.         return( now.getHours()-1 + divider + minutes );
  53.  
  54.         // Other versions may work with this ?    
  55.     return( now.getHours() + divider + minutes );
  56. }
  57.  
  58.  
  59. // isMacintoshBrowser()
  60. // Returns: Boolean value, true if the browser is running under MacOS
  61.  
  62. function isMacintoshBrowser()
  63. { 
  64.     return(navigator.appVersion.lastIndexOf('Mac') != -1 );
  65. }
  66.  
  67.  
  68. // sayHello ()
  69. // Inserts text dynamically in the document when it is called
  70. // Note that all text are dynamically inserted into the document
  71. // when a call to  this function are made in the BODY part of the file.
  72.  
  73. function sayHello ()
  74. {
  75.  
  76.  
  77.     document.write(    "今の時刻は <B>" + 
  78.                 getTime() + 
  79.                 "</B> です。" );
  80.  
  81.  
  82.     if(getHourOfDay()<5 || getHourOfDay()>19)
  83.         document.write('<FONT COLOR="2C396D"> おやすみなさい！</FONT>');
  84.     else 
  85.     {
  86.         if ( getHourOfDay() <11) 
  87.         {
  88.             document.write('<FONT COLOR="52A553">おはようございます</FONT>');
  89.         } 
  90.         else 
  91.         { 
  92.             document.write('<FONT COLOR="ED363C">こんにちわ！</FONT>');
  93.         }
  94.     }
  95. }
  96.  
  97. // -- End of JavaScript code -------------- -->
  98. </SCRIPT>
  99.  
  100. </HEAD>
  101. <BODY BGCOLOR=FFFFFF TEXT=000000>
  102. <H1>JavaScript ダイナミックドキュメント</H1>
  103.  
  104. <B>このひな形ページには、ダイナミックページをを作成する JavaScript の例が含まれています。</B>
  105. <P>
  106. 現在 JavaScript は Netscape Navigator 2.0 以降と MS Internet Explorer 3.0 以降でのみ使用できることに注意して下さい。
  107. <BR>
  108. <FONT COLOR="931B15">あなたはすべての読者が JavaScript を埋め込まれたブラウザを使用していると思ってはいけません。</FONT>
  109. <HR>
  110. この例ではダイナミックページを作るのに JavaScript がどのように使われるかを説明します。ここでは、ブラウザ・システムでのローカル時刻や読者が使っている OS によって表示されるコンテンツが変更されます。
  111. <P>
  112.  
  113. <!-- 1) Let the reader know the browser ID used
  114.       (this is often logged by servers for keeping statistics) -->
  115.  
  116. いらっしゃい <B><SCRIPT>
  117. <!--
  118. document.write(navigator.userAgent)
  119. // -->
  120. </SCRIPT></B> ですね！
  121. <P>
  122.  
  123.  
  124. <!-- 2) Tell the name of the browser used -->
  125.  
  126. <SCRIPT>
  127. <!--
  128. document.write("ここで ", navigator.appName," ", navigator.appVersion, "を使っている方にお会いできるとは")
  129. // -->
  130. </SCRIPT>
  131. <P>
  132.  
  133.  
  134. <!-- 3) Say something that depends upon the readers local time -->
  135. <!-- This is all done in the function sayHello -->
  136.  
  137. <SCRIPT>
  138. <!--
  139. sayHello()
  140. // -->
  141. </SCRIPT>
  142.  
  143.  
  144. <!-- 4) Finally, say something special to the MacOS users -->
  145.  
  146. <SCRIPT>
  147. <!--
  148.  
  149. if (isMacintoshBrowser())
  150.     document.write(
  151.     '<P><FONT COLOR="385FD1">あなたが MacOS を使っているのはとても素敵です！</FONT>'); 
  152. else
  153.     document.write(
  154.     '<P>あなたが Mac を使ってこのページを見ないのはとても悲しいことです。')
  155. // -->
  156. </SCRIPT>
  157.  
  158. <HR>
  159.  
  160. <P>
  161. <B>使い方</B><BR>
  162. 4 つの小さなスクリプトがこのページのテキスト・コンテンツの中に埋め込まれています。このページが読み込まれると、スクリプトが実行され(テキストが挿入)されます。どのような仕組になっているか、ソースファイルを読んでください。すべての関数には説明のコメントが付けてあります。
  163. <P>
  164. スクリプトの中にあるコンテンツをあなたのテキスト関数を呼び出すように置き換えて、スクリプトの <FONT COLOR="FF3366"><CODE>document.write()</CODE></FONT> 関数の中で表示したいテキストを追加してください。複雑なスクリプトの関数を作る場合はそれらを HEAD セクションに置くと良いでしょう。ここで使われている <TT>sayHello</TT> 関数を参考にしてください。
  165.  
  166. <P>
  167. すべてのテキストが <FONT COLOR="FF3366"><CODE>document.write()</CODE></FONT> 関数の中に置かれているかどうか確認してください。そうでない場合は JavaScript をサポートしていないブラウザで見たとき変に表示されてしまいます。
  168.  
  169. <P>
  170. このページを編集するか選択したスクリプトをコピーしてあなたのダイナミックページを作りましょう！
  171. <P>
  172. <HR>
  173. <P>
  174. <B>上で示したダイナミックテキスト例のコード：
  175. </B>
  176. <XMP>いらっしゃい <B><SCRIPT>
  177. <!--
  178. document.write(navigator.userAgent)
  179. // -->
  180. </SCRIPT></B>!</XMP>
  181.  
  182.  JavaScriptをサポートしていないブラウザでは "<B>いらっしゃい</B>" だけが表示されるテキストであることに注意してください。
  183. <P>
  184.  あなたは <FONT COLOR="555555"><!--</FONT> コメント (下記参照)を<I>省略しても</I>スクリプトを書くことができます。しかしここでそうすると実際のスクリプトが JavaScript をサポートしていないブラウザで見えてしまいます。あまりお薦めできません：
  185.  
  186. <FONT COLOR="FF3366"><XMP>いらっしゃい <B><SCRIPT>document.write(navigator.userAgent);</SCRIPT></B>!
  187. </XMP></FONT>
  188.  
  189. <P>
  190. <HR>
  191. <P>
  192. <B>この関数は HEAD に置かれて、ブラウザが Mac である場合に true を返します：</B><BR>
  193.  
  194. <XMP>function isMacintoshBrowser()
  195. { 
  196.   return(navigator.appVersion.lastIndexOf('Mac') != -1 );
  197. }
  198. </XMP>
  199.  
  200. この関数は、スクリプトの中で以下のように使います：
  201. <XMP>if (isMacintoshBrowser())
  202.   document.write('Mac specific text...'); 
  203. else
  204.   document.write('Text for other platforms...')
  205. </XMP>
  206. <P>
  207. <HR>
  208. <P>
  209. <B>バグについて：</B><BR>
  210. スクリプトのこのバージョンでは、 Navigator 3.0 (および 2.0) で時刻が正しく表示されるよう getTime() を変更しました。 2.0 と比較すると 3.0 バージョンでは 時刻が 1 時間進んでいるようです。これは夏時間か何かなのかなあ？
  211.  
  212. <P>
  213. <!--Translated by <A HREF="mailto:hosoka@ca2.so-net.or.jp">Shuji HOSOKAWA</A>-->
  214. </BODY>
  215. </HTML>
  216.